import { Provider } from 'react-redux'
import { BrowserRouter as Router, Switch, Route, Link } from 'react-router-dom'
import { Home, About, Users, User } from './pages'
import store from './store'

export default function RouterApp() {
  return (
    <Router>
      <Provider store={store}>
        <div className="container">
          <div>
            <div>
              <Link to="/">To Home</Link>
            </div>
            <div>
              <Link to="/about">To About</Link>
            </div>
            <div>
              <Link to="/users">To Users</Link>
            </div>
          </div>
          <Switch>
            <Route path="/" exact>
              <Home />
            </Route>
            <Route path="/about">
              <About />
            </Route>
            <Route path="/users" exact>
              <Users />
            </Route>
            <Route path="/users/:id">
              <User />
            </Route>
          </Switch>
        </div>
      </Provider>
    </Router>
  )
}
